


  window.addEventListener("DOMContentLoaded", function() {
  	
//	下面设置一个点击叉叉图片就关闭整个在移动的图片的样式
		var move_box = document.getElementById("move_box");
		var closeimg = document.getElementById("closeimg");
		closeimg.onclick = function() {
			var answer = confirm("您好，确定要关闭我吗~");
			if(answer == true) {
				move_box.style.display = "none";
				alert("如果您需要扫码我们的官网二维码，可以在右下角的 '首页' 查看~\n祝您生活愉快~");
			} else {
				move_box.style.display = 'block';
			}
		}
		

  	
//	以下为微信公众号专区的JavaScript事件设置
  	
	    var javas01 = function(e1,e2) {
		  e1.style.transition = "all 1.3s";
//		  e1.style.transform = "rotate(360deg)";
		  e1.innerHTML = e2;
	  
		}
		var javas02 = function(e1,e2) {
		  e1.style.transition = "all 1.3s";
//		  e1.style.transform = "rotate(-360deg)";
		  e1.innerHTML = e2;
			  
		}
		
		var weiXin_area = document.getElementById("weixin_area01");
	    var weiXin_area_h2 = document.getElementById("weixin_area").querySelector("h2");//获取类名为wx_passage 的元素，即各个微信专区的子盒子
		
		weiXin_area.addEventListener("mouseover", function() {	//鼠标悬浮到这个微信文章专区后旋转180度，innerHTML内容变成其他的
		 var weiXin_area_funct = javas01(weiXin_area_h2,"快来关注我们的微信吧~" + "			<img src='images/官网二维码.png' width='60' alt='官网二维码图片' title='官网二维码' />");
		})
		weiXin_area.addEventListener("mouseleave", function() {	//鼠标离开这个微信文章专区后恢复原样
		 var weiXin_area_funct = javas02(weiXin_area_h2,"<img src='images/微信图标放于标题处.png' alt='微信公众号专区图标' title='微信公众号专区图标' width='50'>   微信公众号专区");
		})
		
		
//		以下为窗口最右侧的固定定位的id = fixed_right_box 的存放时间的子盒子 id = time_save_box 的事件设置 ！！！
		diaoYong_time;
	   // 以下区域用来设置时间并显示之
	   var setInterv = function(e, r) {
		   setInterval(e,r);
	   }
	  
	   
	   var time = document.getElementById("time_save_box");
	   var time_now = function() {
		    var time01 = new Date();
		   var year = time01.getFullYear();   //获取当年的年数，如今年的为2020，这里不能写为 getYear（）这样，错的！！！
		   var month = time01.getMonth();   //获取月份 0 ~ 11
		   var today = time01.getDate();   //获取月份内的 1~31 的 日期数
		   var hours = time01.getHours();  //获取小时数
		   var minutes = time01.getMinutes();  //获取分钟数
		   var seconds = time01.getSeconds();  //获取秒数
		   var day = time01.getDay(); //获取星期数，0为星期天，1~6为星期一 ~ 星期六
		   
		   hours = hours > 10 ? hours:"0"+hours;
		   minutes = minutes > 10 ? minutes:"0"+minutes;
		   seconds = seconds > 10 ? seconds:"0"+seconds;
		   switch(day) {
			   case 0:
				day = "星期天";
				break;
				
			   case 1:
				day = "星期一";
				break;
				
			   case 2:
				day = "星期二";
				break;
				
			   case 3:
				day = "星期三";
				break;
				
			   case 4:
				day = "星期四";
				break;
				
			   case 5:
				day = "星期五";
				break;
				
			   case 6:
				day = "星期六";
				break;
				
			   default:
			    day = "星期未能获取";
				break;
		   }
		   
		   time.innerHTML = "&nbsp;&nbsp;&nbsp;&nbsp;现在的时间是：<br/>"+year+" 年 "+(month+1)+" 月 "+today
							+" 日 "+hours+": "+minutes+": "+seconds+"      <br/>"+day;
		   
	   }
	   // 记住,在获取时间后,一定要调用setInterval函数和装载时间的函数,例如本例中用的变量time_now 来装载获得的时间的那个函数
	   var diaoYong_time = setInterv(time_now,1000);
  
  var img_box = document.querySelector(".img_box");
  var lun_bo = document.getElementById("lun_bo");
  var lun_bo_first = document.getElementById("lun_bo_first");
  var lun_bo_second = document.getElementById("lun_bo_second");
 	var lun_bo_div1 = document.getElementById("one");
 	var lun_bo_div2 = document.getElementById("two");
 
  lun_bo.style.transition = "all 4s";
  var i = 1;
  lun_bo_first.style.display = "block";
  lun_bo_div1.style.background = "#0FDBC3";
  function lunbo() {
  	
  	if ((i-1) % 2 == 0) {
  		lun_bo_first.style.display = "none";
	  	lun_bo_second.style.display = "block";
  		lun_bo_div1.style.background = "";
			lun_bo_div2.style.background = "#0FDBC3";
  	
	  } else if(i % 2 == 0){
	  	lun_bo_first.style.display = "block";
  		lun_bo_second.style.display = "none";
	  	lun_bo_div1.style.background = "#0FDBC3";
			lun_bo_div2.style.background = "";
	  	
	  }/* else if((i-3) % 3 == 0) {
	  	
	  	lun_bo.innerHTML = lun_bo_third.innerHTML;
	  	
	  }*/
	  i++;

  }
  /*当点击轮播图片下方的盒子div 序号为 1 时,显示第一张图片,该序号盒子背景颜色变为蓝绿色,而另外的div序号为2 的就背景颜色为白色,第二张图片不显示;
  同理地,当点击轮播图片下方的盒子div 序号为 2 时,显示第二张图片,该序号盒子背景颜色变为蓝绿色,而另外的div序号为 1 的就背景颜色为白色,第一张图片不显示;*/
  lun_bo_div1.onclick = function() {
  	lun_bo_first.style.transition = "all 0.4s";
  	lun_bo_second.style.transition = "all 0.4s";
		lun_bo_first.style.display = "block";
		lun_bo_second.style.display = "none";
		lun_bo_div1.style.background = "#0FDBC3";
		lun_bo_div2.style.background = "";
		
	}
	lun_bo_div2.onclick = function() {
		lun_bo_first.style.transition = "all 0.4s";
  	lun_bo_second.style.transition = "all 0.4s";
		lun_bo_first.style.display = "none";
	  lun_bo_second.style.display = "block";
	  lun_bo_div1.style.background = "";
		lun_bo_div2.style.background = "#0FDBC3";
		
	}
	var lunbo_move = setInterval(lunbo, 2000);
	img_box.addEventListener("mouseover", function() {
		clearInterval(lunbo_move);
	})
	img_box.addEventListener("mouseleave", function() {
		lunbo_move = setInterval(lunbo, 2000);
	})
		


//以下为设置底部的固定盒子在窗口滚动一定距离后出现且点击各个小盒子时能快速到达所对应的区域，同时给回到顶部的盒子设置回到顶部的功能
		var backtoTop = document.getElementById("backtoTop");
		var down_arrow1 = document.getElementById("down_arrow1");
		var down_arrow2 = document.getElementById("down_arrow2");
		var down_arrow3 = document.getElementById("down_arrow3");
		var down_arrow4 = document.getElementById("down_arrow4");
		var down_arrow5 = document.getElementById("down_arrow5");
		var timer = null;
		var img_src = ["images/向上箭头5.png", "images/向上箭头4.png", "images/向上箭头3.png", "images/向上箭头2.png", "images/向上箭头1.png"];
//		下面获取footer标签大盒子的id,并将它存放在一个变量里面
		var footer_box = document.getElementById("footer_box");
		var footer_pageY = footer_box.offsetTop;
		var bottombox = document.getElementById("bottom_fixed");
//			
		
			
//下面设置一个窗口滚动监听事件来计算滚动单位是多少 ！！！
		//var headest_boxoffsety = document.getElementById("headest_ul").offsetTop;
		var img_boxoffsety = document.getElementById("img_box").offsetTop;
		var scie_research_areaoffsety = document.getElementById("scie_research_area").offsetTop;
		var weixin_areaoffsety = document.getElementById("weixin_area").offsetTop;
		var news_divoffsety = document.getElementById("news_div").offsetTop;
		document.addEventListener("scroll", function(e) {
			var soll = document.body.scrollTop || document.documentElement.scrollTop;
			console.log(soll);
//			var soll = e.pageY;
			if(soll > 70 && soll < 5380) {
				bottombox.style.display = "block";
			} else {
				bottombox.style.display = "none";
			}
			down_arrow1.src = soll > img_boxoffsety ? img_src[0] : "images/向下箭头5.png";
			down_arrow2.src = soll > (scie_research_areaoffsety - 200) ? img_src[1] : "images/向下箭头4.png";
			down_arrow3.src = soll > (weixin_areaoffsety - 200) ? img_src[2] : "images/向下箭头3.png";
			down_arrow4.src = soll > (news_divoffsety - 400) ? img_src[3] : "images/向下箭头2.png";
//			down_arrow5.src = soll > 600 ? img_src[4] : "images/向下箭头1.png";
			
			//下面来设置孵化(研究)成果区域的事件,让鼠标滚动340单位时就显示出来，opacity = 0 表示完全透明，opacity = 1表示不透明
		var scie_research_area = document.getElementById("scie_research_area");
		scie_research_area.style.transition = "all 0.4s";
		weiXin_area.parentNode.style.transition = "all 0.4s";
		scie_research_area.style.opacity = soll < (scie_research_areaoffsety - 270) ? "0" : "1"; //这里把650改成600,1670改成1650
		weiXin_area.parentNode.style.opacity = soll < (weixin_areaoffsety - 400) ? "0" : "1";	
			
			
			
			
		})
		
		var unwrap = document.getElementById("unwrap");
		var disappear_ul = document.querySelector(".disappear_ul");
		var essay_journal = document.getElementById("essay_journal");
		//鼠标  进入id=essay_journal的盒子后就  "显示出来 "原来就隐藏的ul列表
		essay_journal.onmouseover = function() {
			unwrap.style.display = "block";
			if(disappear_ul.style.display == "none") {
				unwrap.src = "images/展开.png";
				unwrap.title = "展开隐藏列表";
				unwrap.onclick = function() {
					
					disappear_ul.style.display = "block";
				}
				
			} else {
					unwrap.src = "images/收起.png";
					unwrap.title = "收起隐藏列表";
					unwrap.onclick = function() {
						
						disappear_ul.style.display = "none";
					}
				}
			//鼠标离开id=essay_journal的盒子后就  "隐藏"  原来就隐藏的ul列表
		essay_journal.onmouseleave = function() {
			unwrap.style.display = "none";
			disappear_ul.style.display = "none";
		}
			
//				disappear_ul.style.transition = "all 0.4s";
				
			}
			
			
			
		
		
//		下面获得新闻公告&学术论文盒子后面的ul列表的a链接
		var extra_links = document.getElementById("extra_links");
		var ul_a = document.getElementById("extra_links").getElementsByTagName("a");
		var ul_img = document.getElementById("extra_links").getElementsByTagName("img");
		var i = null;
		function yellow() {
			i = Math.ceil(Math.random()*ul_a.length) - 1;
			for (var j = 0; j < ul_a.length; j++) {
				ul_a[j].style.background = "";
				ul_a[j].style.transition = "all 0.4s";

			}
			for (var j = 0; j < ul_img.length; j++) {

				ul_img[j].style.transition = "all 0.4s";
				ul_img[j].style.transform = "scale(1)";
			}
			ul_a[i].style.transition = "all 0.4s";
			ul_a[i].style.background = "yellow";
			
			ul_img[i].style.transition = "all 0.4s";
			ul_img[i].style.transform = "scale(1.2)";
		}
		//接下来调用setInterval函数进行实时不断地闪亮背景颜色,为黄色yellow
		var bright = setInterv(yellow, 1000);
/*//		接下来设置一旦鼠标悬浮在id = extra_links的ul 盒子上时就停止变化背景颜色,大小
		extra_links.onmouseover = function() {
			clearInterval(bright);
		}
		extra_links.onmouseleave = function() {
			bright = setInterv(yellow, 1000);
		}*/
  
  })
  
  
  
//以下为废弃的代码,可待用

		/*if(soll > 700 && soll < 1100) {
				down_arrow1.src =  img_src[0];
				down_arrow2.src =  "images/向下箭头(4).png";
				down_arrow3.src =  "images/向下箭头(3).png";
				down_arrow4.src =  "images/向下箭头(2).png";
				down_arrow5.src =  "images/向下箭头(1).png";
			} else if(soll < 1500) {
				down_arrow1.src =  img_src[0];
				down_arrow2.src =  img_src[1];
				down_arrow3.src =  "images/向下箭头(3).png";
				down_arrow4.src =  "images/向下箭头(2).png";
				down_arrow5.src =  "images/向下箭头(1).png";
			} else if(soll < 2000) {
				down_arrow1.src =  img_src[0];
				down_arrow2.src =  img_src[1];
				down_arrow3.src =  img_src[2];
				down_arrow4.src =  "images/向下箭头(2).png";
				down_arrow5.src =  "images/向下箭头(1).png";
			} else if(soll < 2500) {
				down_arrow1.src =  img_src[0];
				down_arrow2.src =  img_src[1];
				down_arrow3.src =  img_src[2];
			  down_arrow4.src =  img_src[3];
				down_arrow5.src =  "images/向下箭头(1).png";
			} else if(soll > 2500) {
				down_arrow1.src =  img_src[0];
				down_arrow2.src =  img_src[1];
				down_arrow3.src =  img_src[2];
			  down_arrow4.src =  img_src[3];
				down_arrow5.src =  img_src[4];
			} else {
				down_arrow1.src =  "images/向下箭头(5).png";
				down_arrow2.src =  "images/向下箭头(4).png";
				down_arrow3.src =  "images/向下箭头(3).png";
				down_arrow4.src =  "images/向下箭头(2).png";
				down_arrow5.src =  "images/向下箭头(1).png";
			}*/
//			if(soll > 700) {
//				alert("12");
//				down_arrow1.src =  img_src[0];
//				if(soll > 1100) {
//					down_arrow2.src =  img_src[1];
//					if(soll > 1500) {
//						down_arrow3.src =  img_src[2];
//						if(soll > 2000) {
//						  down_arrow4.src =  img_src[3];
//							if(soll > 2500) {
//							  down_arrow5.src =  img_src[4];
//							} else {
//								down_arrow5.src =  "images/向下箭头(1).png";
//							}
//						} else {
//							down_arrow4.src =  "images/向下箭头(2).png";
//						}
//					} else {
//						down_arrow3.src =  "images/向下箭头(3).png";
//					}
//				} else {
//					down_arrow2.src =  "images/向下箭头(4).png";
//				}
//			} else {
//				down_arrow1.src =  "images/向下箭头(5).png";
//			}